class banner {
    constructor(el) {
        this.el = el;
        this.oli = this.el.find(".carousel-indicators li");
        this.oitem = this.el.find(".index-banner-inner page-banner");
        this.oleft = this.el.find(".index-b-left");
        this.oright = this.el.find(".index-b-right");
        this.imgindex = 0;
        this.leftandrigth();
        this.autoplay();
        this.mouseover();
        this.mouseclick();
    }
    leftandrigth() {
        this.oleft.on("click", () => {
            if (this.imgindex < 0) {
                this.imgindex = 3
            }
            console.log(this.imgindex)
            $(".index-banner").find(".page-banner").eq(this.imgindex).fadeIn().siblings().fadeOut();
            $(".index-banner").find("li").eq(this.imgindex).addClass("current").siblings().removeClass("current");
            this.imgindex--;
            console.log(this.imgindex)
        })
        this.oright.on("click", () => {
            if (this.imgindex > 3) {
                this.imgindex = 0
            }
            console.log(this.imgindex)
            $(".index-banner").find(".page-banner").eq(this.imgindex).fadeIn().siblings().fadeOut();
            $(".index-banner").find(".carousel-indicators").find("li").eq(this.imgindex).addClass("current").siblings().removeClass("current");
            this.imgindex++;
        })
        this.timer = setInterval(() => {
            this.imgindex++;
            this.autoplay()
        }, 3500)
    }
    autoplay() {
        if (this.imgindex > 3) {
            this.imgindex = 0
        }
        console.log(this.imgindex)
        $(".index-banner").find(".page-banner").eq(this.imgindex).fadeIn().siblings().fadeOut();
        $(".index-banner").find("li").eq(this.imgindex).addClass("current").siblings().removeClass("current");
    }
    mouseover() {
        $(".index-banner").on("mouseenter", () => {
            clearInterval(this.timer)
        })
        $(".index-banner").on("mouseleave", () => {
            this.timer = setInterval(() => {
                this.imgindex++
                this.autoplay()
            }, 3500)
        })
    }
    mouseclick() {
        this.oli.on("click", (e) => {
            let $index = $(e.target).index();
            console.log($index)
            this.imgindex = $index;
            console.log(this.imgindex)
            this.autoplay()
        })
    }
}
(function () {
    $.fn.extend({
        banner() {
            new banner(this)
        }
    })
})()
$(function () {
    $(".index-banner").banner()

})